/* ====================================================== 
   <!-- WordPress Core ( Do not use prefix "uix-" ) -->              
/* ====================================================== */
@import '@uixkit/core/_global/scss/_variable-and-mixin.scss';

/*
 * 1. General
 * 2. Text meant only for screen readers.
 * 3. Galleries for block
*/


/* 
 ---------------------------
 1. General
 ---------------------------
 */ 

.alignnone {
    margin: 0.4375rem 0 1.27624999994rem 1.27624999994rem;
}


.alignright {
    float: left;
    margin: 0.4375rem 1.27624999994rem 1.27624999994rem 0;
}

.alignleft {
    float: right;
    margin: 0.4375rem 0 1.27624999994rem 1.27624999994rem;
}

a img {
	&.alignright {
		float: left;
		margin: 0.4375rem 1.27624999994rem 1.27624999994rem 0;
	}
	&.alignnone {
	    margin: 0.4375rem 0 1.27624999994rem 1.27624999994rem;
	}
	&.alignleft {
		float: right;
		margin: 0.4375rem 0 1.27624999994rem 1.27624999994rem;
	}

}

.wp-caption {

	&.alignnone, 
	&.alignleft {
	    margin: 0.4375rem 0 1.27624999994rem 1.27624999994rem;
	}
	&.alignright {
	    margin: 0.4375rem 1.27624999994rem 1.27624999994rem 0;
	}

}


/* 
 ---------------------------
 2. Text meant only for screen readers.
 ---------------------------
 */ 

.screen-reader-text {
	
	&:focus {
		left: auto;
		right: 0.4375rem;
	}
}

/* 
 ---------------------------
 3. Galleries for block
 ---------------------------
 */ 
ul.wp-block-gallery {
    display: flex;
    flex-wrap: wrap;
    list-style-type: none;
    padding: 0;
}

ul.wp-block-gallery .blocks-gallery-image,
  ul.wp-block-gallery .blocks-gallery-item {
    margin: 0 0 16px 16px;
    display: flex;
    flex-grow: 1;
    flex-direction: column;
    justify-content: center;
    position: relative;
}

ul.wp-block-gallery .blocks-gallery-image figure,
    ul.wp-block-gallery .blocks-gallery-item figure {
    margin: 0;
    height: 100%;
}

@supports ((position: -webkit-sticky) or (position: sticky)) {
    ul.wp-block-gallery .blocks-gallery-image figure,
        ul.wp-block-gallery .blocks-gallery-item figure {
        display: flex;
        align-items: flex-end;
        justify-content: flex-start;
    }
}

ul.wp-block-gallery .blocks-gallery-image img,
    ul.wp-block-gallery .blocks-gallery-item img {
    display: block;
    max-width: 100%;
    height: auto;
}

ul.wp-block-gallery .blocks-gallery-image img,
    ul.wp-block-gallery .blocks-gallery-item img {
    width: 100%;
}

@supports ((position: -webkit-sticky) or (position: sticky)) {
    ul.wp-block-gallery .blocks-gallery-image img,
        ul.wp-block-gallery .blocks-gallery-item img {
        width: auto;
    }
}

ul.wp-block-gallery .blocks-gallery-image figcaption,
    ul.wp-block-gallery .blocks-gallery-item figcaption {
    position: absolute;
    bottom: 0;
    width: 100%;
    max-height: 100%;
    overflow: auto;
    padding: 40px 10px 5px;
    color: #fff;
    text-align: center;
    font-size: 13px;
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.7) 0, rgba(0, 0, 0, 0.3) 60%, transparent);
}

ul.wp-block-gallery .blocks-gallery-image figcaption img,
      ul.wp-block-gallery .blocks-gallery-item figcaption img {
    display: inline;
}

ul.wp-block-gallery.is-cropped .blocks-gallery-image a,
  ul.wp-block-gallery.is-cropped .blocks-gallery-image img,
  ul.wp-block-gallery.is-cropped .blocks-gallery-item a,
  ul.wp-block-gallery.is-cropped .blocks-gallery-item img {
    width: 100%;
}

@supports ((position: -webkit-sticky) or (position: sticky)) {
    ul.wp-block-gallery.is-cropped .blocks-gallery-image a,
      ul.wp-block-gallery.is-cropped .blocks-gallery-image img,
      ul.wp-block-gallery.is-cropped .blocks-gallery-item a,
      ul.wp-block-gallery.is-cropped .blocks-gallery-item img {
        height: 100%;
        flex: 1;
        -o-object-fit: cover;
        object-fit: cover;
    }
}

ul.wp-block-gallery .blocks-gallery-image,
  ul.wp-block-gallery .blocks-gallery-item {
    width: calc((100% - 16px) / 2);
}

ul.wp-block-gallery .blocks-gallery-image:nth-of-type(even),
    ul.wp-block-gallery .blocks-gallery-item:nth-of-type(even) {
    margin-left: 0;
}

ul.wp-block-gallery.columns-1 .blocks-gallery-image,
  ul.wp-block-gallery.columns-1 .blocks-gallery-item {
    width: 100%;
    margin-left: 0;
}

@media (min-width: 600px) {
    ul.wp-block-gallery.columns-3 .blocks-gallery-image,
    ul.wp-block-gallery.columns-3 .blocks-gallery-item {
        width: calc((100% - 16px * 2) / 3);
        margin-left: 16px;
    }

    ul.wp-block-gallery.columns-4 .blocks-gallery-image,
    ul.wp-block-gallery.columns-4 .blocks-gallery-item {
        width: calc((100% - 16px * 3) / 4);
        margin-left: 16px;
    }

    ul.wp-block-gallery.columns-5 .blocks-gallery-image,
    ul.wp-block-gallery.columns-5 .blocks-gallery-item {
        width: calc((100% - 16px * 4) / 5);
        margin-left: 16px;
    }

    ul.wp-block-gallery.columns-6 .blocks-gallery-image,
    ul.wp-block-gallery.columns-6 .blocks-gallery-item {
        width: calc((100% - 16px * 5) / 6);
        margin-left: 16px;
    }

    ul.wp-block-gallery.columns-7 .blocks-gallery-image,
    ul.wp-block-gallery.columns-7 .blocks-gallery-item {
        width: calc((100% - 16px * 6) / 7);
        margin-left: 16px;
    }

    ul.wp-block-gallery.columns-8 .blocks-gallery-image,
    ul.wp-block-gallery.columns-8 .blocks-gallery-item {
        width: calc((100% - 16px * 7) / 8);
        margin-left: 16px;
    }

    ul.wp-block-gallery.columns-1 .blocks-gallery-image:nth-of-type(1n),
    ul.wp-block-gallery.columns-1 .blocks-gallery-item:nth-of-type(1n) {
        margin-left: 0;
    }

    ul.wp-block-gallery.columns-2 .blocks-gallery-image:nth-of-type(2n),
    ul.wp-block-gallery.columns-2 .blocks-gallery-item:nth-of-type(2n) {
        margin-left: 0;
    }

    ul.wp-block-gallery.columns-3 .blocks-gallery-image:nth-of-type(3n),
    ul.wp-block-gallery.columns-3 .blocks-gallery-item:nth-of-type(3n) {
        margin-left: 0;
    }

    ul.wp-block-gallery.columns-4 .blocks-gallery-image:nth-of-type(4n),
    ul.wp-block-gallery.columns-4 .blocks-gallery-item:nth-of-type(4n) {
        margin-left: 0;
    }

    ul.wp-block-gallery.columns-5 .blocks-gallery-image:nth-of-type(5n),
    ul.wp-block-gallery.columns-5 .blocks-gallery-item:nth-of-type(5n) {
        margin-left: 0;
    }

    ul.wp-block-gallery.columns-6 .blocks-gallery-image:nth-of-type(6n),
    ul.wp-block-gallery.columns-6 .blocks-gallery-item:nth-of-type(6n) {
        margin-left: 0;
    }

    ul.wp-block-gallery.columns-7 .blocks-gallery-image:nth-of-type(7n),
    ul.wp-block-gallery.columns-7 .blocks-gallery-item:nth-of-type(7n) {
        margin-left: 0;
    }

    ul.wp-block-gallery.columns-8 .blocks-gallery-image:nth-of-type(8n),
    ul.wp-block-gallery.columns-8 .blocks-gallery-item:nth-of-type(8n) {
        margin-left: 0;
    }
}

ul.wp-block-gallery .blocks-gallery-image:last-child,
  ul.wp-block-gallery .blocks-gallery-item:last-child {
    margin-left: 0;
}

ul.wp-block-gallery .blocks-gallery-item.has-add-item-button {
    width: 100%;
}

ul.wp-block-gallery.alignleft, ul.wp-block-gallery.alignright {
    max-width: 305px;
    width: 100%;
}

ul.wp-block-gallery.alignleft, ul.wp-block-gallery.aligncenter, ul.wp-block-gallery.alignright {
    display: flex;
}

ul.wp-block-gallery.aligncenter .blocks-gallery-item figure {
    justify-content: center;
}
